<template>
  <el-dialog :title="title" :visible.sync="open" width="300px" append-to-body @close="cancel">

    <p>正在查询中，请稍等...{{ countdown }}s</p>
<!--    <div slot="footer" class="dialog-footer">-->
<!--      <el-button type="primary" @click="handleOk">确 定</el-button>-->
<!--      <el-button @click="cancel">取 消</el-button>-->
<!--    </div>-->
  </el-dialog>
</template>

<script>
  import { rent } from '@/api/system/order'
  export default {
    name: "rentPromt",
    data() {
      return {
        title: '系统提示',
        rowObj: {},
        open: false,
        countdown: 3, // 倒计时初始值
      }
    },
    methods: {
      show(row) {
        this.open = true
        this.rowObj = row
        this.countdown = 3 // 重置倒计时
        this.startCountdown()
      },
      startCountdown() {
        this.timer = setInterval(() => {
          if (this.countdown > 0) {
            this.countdown--
          } else {
            clearInterval(this.timer)
            this.open = false
            if (this.rowObj.rentalStatus!=1) {
              this.$message.warning('该充电宝已借出，请尝试其他充电宝！')
            } else {
              this.$emit('rent', this.rowObj)
            }
          }
        }, 1000)
      },
      cancel() {
        clearInterval(this.timer)
        this.open = false
        this.$emit('close')
      },
    }
  }
</script>

<style scoped>

/deep/ .el-dialog__body {
  padding-top: 10px;
}

</style>

